<ion-header>
    <ion-toolbar content-page>
        <ion-buttons start>
            <button ion-button icon-only navPop>
                <i class="back"></i>
            </button>
        </ion-buttons>
        <ion-title>
            回放筛选
        </ion-title>
    </ion-toolbar>
</ion-header>
<ion-content>
    <div class="content-rel">
        <div class="row row-title">
            回放类型
        </div>
        <div class="row filter-btns">
            <div class="filter-btn filter-btn_type"
                 [ngClass]="{ 'filter-btn_selected': playbackFil.type == allItem.id ,'filter-btn_noselected':playbackFil.type != allItem.id }"
                 (click)="changeFilter(allItem.id)"  [innerHTML]="allItem.name"></div>

            <div class="filter-btn filter-btn_type"
                 [ngClass]="{ 'filter-btn_selected': playbackFil.type == item.id ,'filter-btn_noselected':playbackFil.type != item.id }"
                 (click)="changeFilter(item.id)" *ngFor="let item of typeList"  [innerHTML]="item.name"></div>
        </div>
        <div class="row row-title">
            <div>直播时间</div>
            <button class="clear-btn"
                    *ngIf="playbackFil.starttime || playbackFil.endtime" (click)="cleanTime()">清除</button>
        </div>
        <div class="row">
            <ion-datetime cancelText="取消" doneText="确定" displayFormat="YYYY/MM/DD" pickerFormat="YYYYMMDD"
                          yearValues="{{yearList}}"
                          [max]="filterRange.max" (ionChange)="validateForm()"
                          [class.error_input]="!canSubmit"
                          [pickerOptions]="pickerOption" [(ngModel)]="playbackFil.starttime">
            </ion-datetime>
            <div class="datetime-Separator"></div>
            <ion-datetime cancelText="取消" doneText="确定" displayFormat="YYYY/MM/DD" pickerFormat="YYYYMMDD"
                          yearValues="{{yearList}}"
                          [min]="filterRange.min" (ionChange)="validateForm()"
                          [class.error_input]="!canSubmit"
                          [pickerOptions]="pickerOption" [(ngModel)]="playbackFil.endtime">
            </ion-datetime>
        </div>
    </div>
</ion-content>
<ion-footer>
    <ion-row>
        <ion-col>
            <button ion-button  class="foot-btn_reset" (click)="resetForm()">重置</button>
        </ion-col>
        <ion-col>
            <button ion-button class="foot-btn_done"  [disabled]="disabled" (click)="doSearch()">查询</button>
        </ion-col>
    </ion-row>
</ion-footer>
